$(function() {
  var dom = document.getElementById('map');
  var myChart = echarts.init(dom);

  option = null;
  myChart.showLoading();

  $('#satisflyTable tbody').on('click', 'tr', function() {
    var id = $(this).data('sid');
    location.href = './satisfactionDetail.html?id=' + id;
  })

  $.ajax({
    type: 'get',
    url: 'http://218.205.115.243:18080/afot-web/countSurvey',
    dataType: 'json',
    success: function(res) {
      if (res.operStatus == 1) {
        setTableData(res.data);
      }
    },
    error: function(err) {
      console.log(err)
    }
  });

  function setTableData(data) {
    var html = _.map(data, function(item, index) {
      return [
        '  <tr data-sid="' + item.surveyScenic + '">',
        '    <td>' + (index + 1) + '</td>',
        '    <td>'+ item.surveyScenicName +'</td>',
        '    <td>'+ item.userNum +'</td>',
        '    <td>'+ item.overallScore +'分</td>',
        '    <td>'+ item.comfortLevel +'分</td>',
        '    <td>'+ item.crowdScore +'分</td>',
        '    <td>'+ item.matchingScore +'分</td>',
        '    <td>'+ item.serviceScore +'分</td>',
        '  </tr>'
      ].join("");
    })
    $('#satisflyTable tbody').html(html.join(''));
  }

  $.get('../js/sichuan.json', function(geoJson) {

    myChart.hideLoading();

    echarts.registerMap('SC', geoJson);

    var mapData =  [{
            name: '成都市',
            selected: true
      }];

    var option = {
      series: [{
        type: 'map',
        roam: false,
        mapType: 'SC', // 自定义扩展图表类型
        layoutCenter: ['50%', '50%'],
				layoutSize: 700,
        itemStyle: {
          normal: {
          	areaColor: 'rgba(3,206,249,0.28)',
          	borderColor: '#161C2F',
          	borderWidth: 2,
          },
          emphasis: {
          	areaColor: 'rgba(248,231,28,0.64)'
          }
        },
        label: {
        	normal: {
        		show: true,
        	}
        },
        data: mapData
      }]
    }
    myChart.setOption(option, true)

    myChart.on('click', function(params) {
    	var data = [{ name: params.name, selected: true }]
    	option.series[0].data = data
      myChart.setOption(option)
      $('.star-level').each(function() {
        $(this).find('p').eq(1).text(random())
      })
    })
  });

  function random() {
    return ~~(Math.random() * 200) + 1;
  }
})
